<template>
	<view class="container">
		<nav-bar title="新闻资讯" />
		<view class="press-list">
			<view class="press" v-for="(press, index) in pressList" @click="goPress(press.id)">
				<view class="title">{{ press.title }}</view>
				<view class="subTitle">{{ press.subTitle }}</view>
				<view class="wrap">
					<view class="publishDate">发布时间：{{ press.publishDate }}</view>
					<view class="likeNum">点赞：{{ press.likeNum }}</view>
					<view class="readNum">阅读：{{ press.readNum }}</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import {
		getPressListByKeywords
	} from '@/api/common.js'
	export default {
		data() {
			return {
				keywords: null,

				pressList: null
			}
		},
		onLoad(option) {
			this.keywords = option.key;
			this.getPressList();
		},
		methods: {
			// 获取新闻资讯列表
			getPressList() {
				const _that = this;
				getPressListByKeywords(_that.keywords)
					.then((res) => {
						_that.pressList = res.rows
					})
					.catch(() => {
						uni.showToast({
							title: '加载异常'
						})
					})
			},
			// 跳转到新闻资讯详情
			goPress(id) {
				uni.navigateTo({
					url: `/pages/press/detail?id=${id}`
				});
			}
		}
	}
</script>

<style lang="scss">
	.press-list {
		width: 100%;
		height: 100%;
		overflow-y: scroll;

		.press {
			width: 92%;
			padding: 0.4em 4%;
			margin: 1em 0;
			background-color: $uni-bg-color;

			.title {
				font-size: 1.4em;
				line-height: 1.6em;
			}

			.subTitle {
				font-size: 1.1em;
				line-height: 1.6em;
			}

			.wrap {
				color: $uni-text-color-grey;
				font-size: 0.8em;
				line-height: 2em;
				display: flex;
				justify-content: space-between;
			}
		}
	}
</style>
